import { ref } from 'vue';
import { defineStore } from 'pinia';
import api from '@/http/api';
import tool from "@/utils/tool";
import { ElMessage } from "element-plus";

const components = import.meta.glob(['@/business/!(components)/**/*.vue', '@/business/!(components)/*.vue', '@/flow/*.vue']);
const baseRoutes = [{
  name: 'layout',
  path: '/layout/index',
  text: 'layout',
  component: () => import('@/business/layout/index.vue'),
  children: []
}, {
  name: 'dashboard',
  path: '/dashboard/:dashboardId',
  text: '数据大屏',
  meta: {
    title: '数据大屏',
  },
  component: () => import('@/business/dashboard/index.vue')
}, {
  name: 'notfound',
  path: '/:pathMatch(.*)',
  text: '访问地址不存在',
  meta: {
    title: '访问地址不存在',
  },
  component: () => import('@/error/404.vue')
}];

const getComponent = async(compName, path) => {
  const keys = Object.keys(components);
  const matchKeys = keys.filter((key) => {
    return key.replace('/src/business', '').replace('/src', '').replace('.vue', '') === path;
  });

  const component = components[matchKeys[0]];
  return !component ? null : await component().then(comp => ({
    ...comp.default,
    name: compName
  }));
};

const formatRoute = async(routes, routeMap, routerList) => {
  for (let item of routes) {
    item.name = item.name || item.id;
    item.meta = item.meta || {};

    if (item.data && item.data.type === '页面' && item.data.pageId) {
      item.path = '/home/' + item.name + '/' + item.data.pageId;
      item.component = await getComponent(item.name, '/home/index');
    } else if (item.data && item.data.type === '大屏' && item.data.pageId) {
      item.path = '/dashboard/' + item.name + '/' + item.data.pageId;
      item.component = await getComponent(item.name, '/home/index');
    } else if(item.data && item.data.type === '外链') {
      item.path = '/link/' + item.name;
      item.component = item.data.linkOpenMode === '1' ? await getComponent(item.name, '/iframe/index') : null;
    } else if (item.data && item.data.type === '流程' && item.data.flowId) {
      item.path = '/flow/' + item.name + '/' + item.data.flowId;
      item.component = await getComponent(item.name, '/flow/start');
    } else if (!item.component && item.path) {
      item.component = await getComponent(item.name, item.path);
    }

    item.path = item.path || '';
    item.meta.keepAlive = (typeof item.keepAlive !== 'undefined')
        ? item.keepAlive : ((typeof item.meta.keepAlive === 'undefined') ? true : item.meta.keepAlive);
    item.meta.title = item.text;
    item.meta.icon = item.data && item.data.icon;
    item.meta.buttons = ((item.data && item.data.privileges) || []);
    item.meta.defaultShow = item.data?.defaultShow;
    item.meta.hidden = item.hidden;
    item.meta.url = item.data && item.data.url;

    if (item.id) {
      routeMap[item.id] = item;
    }

    if (item.children && item.children.length > 0) {
      await formatRoute(item.children, routeMap, routerList);

      item.children = item.children.filter(ch => !ch.data || ch.data.type !== '2');
      if ((item.children.length === 0
              || item.children.every(ch => typeof ch.data === "undefined" || ch.data == null || ch.data.type === '权限'))
          && ((item.hidden !== true && item.href && item.data && item.data.url && item.data.type !== '权限')
              || (item.data && (item.data.type === '页面' || item.data.type === '大屏')))) {
        routerList.push({ label: item.text, value: item.id });
      }
    } else {
      if ((item.hidden !== true && item.href && item.data && item.data.url && item.data.type !== '权限')
          || (item.data && (item.data.type === '页面' || item.data.type === '大屏'))) {
        routerList.push({ label: item.text, value: item.id });
      }

      delete item.children;
    }
  }
};

export const useRouterStore = defineStore('router', () => {
  const routes = ref([]);
  const routeMap = ref({});
  const routerList = ref([]);
  const isInit = ref(false);

  const initRouter = async(router, subsystemId) => {
    if (isInit.value) {
      return false;
    }

    router.getRoutes().forEach(item => {
      item.name && router.removeRoute(item.name);
    });

    const res = await api.post('/business/menu/tree/' + subsystemId);
    if (res.code === '500') {
      ElMessage.error(res.message);
      setTimeout(() => {
        window.location.href = tool.getBaseUrl() + '/choose.html';
      }, 1000);
      return;
    }

    const menuTree = res.data && res.data.children || [];
    if (menuTree.length === 0) {
      ElMessage.error("此子系统未配置菜单！");
      setTimeout(() => {
        window.location.href = tool.getBaseUrl() + '/choose.html?stop=1';
      }, 1000);
      return;
    }

    let routeList = tool.deepClone(baseRoutes) || [];
    routeList[0].children.push(...menuTree);
    await formatRoute(routeList, routeMap.value, routerList.value);
    routeList.forEach(route => router.addRoute(route));
    routes.value = routeList;
    isInit.value = true;
    return true;
  };

  const getDefaultRoute = (routeList) => {
    if (!routeList || routeList.length === 0) {
      return null;
    }

    for (let route of routeList) {
      if (route.meta && route.meta.defaultShow === '1') {
        return route;
      }

      let temp = getDefaultRoute(route.children);
      if (temp) {
        return temp;
      }
    }

    return null;
  };

  const getFirstRoute = (routeList) => {
    if (!routeList || routeList.length === 0) {
      return null;
    }

    for (let route of routeList) {
      if ((route.href || route.path) && route.name !== 'layout') {
        return route;
      }

      let temp = getFirstRoute(route.children);
      if (temp) {
        return temp;
      }
    }

    return null;
  };

  const getShowRoute = () => {
    let route = getDefaultRoute(routes.value);
    return route ? route : getFirstRoute(routes.value);
  };

  const getRouteData = (id) => {
    return routeMap.value[id];
  };

  return {
    routes,
    routeMap,
    routerList,
    initRouter,
    getShowRoute,
    getRouteData,
  };
});

